import { PageContainer } from '@ant-design/pro-components';
import { Button, Card, Col, Row, Table, Typography } from 'antd';
import React from 'react';

const Admin: React.FC = () => {
  const columns = [
    {
      title: '谈话类型模板名称',
      dataIndex: 'name',
      key: 'name',
      render: (_) => {
        return <div>{_}</div>;
      },
    },
    {
      title: '操作',
      key: 'action',
      width: 100,
      render: (_) => (
        <Row gutter={10}>
          <Col>
            <Button type="primary">编辑</Button>
          </Col>
        </Row>
      ),
    },
  ];

  const dataSource = [
    {
      name: '新收押人员入所模版',
    },
    {
      name: '诉讼环节发生变化',
    },
    {
      name: '思想不稳定、表现异常模版',
    },
    {
      name: '家庭发生变故模版',
    },
    {
      name: '被加戴械具、处罚模版',
    },
    {
      name: '调换监室的模版',
    },
    {
      name: '要求反映监室动态模版',
    },
    {
      name: '出所前谈话模版',
    },
  ];

  return (
    <PageContainer>
      <Card>
        <Button type="primary" className="mb10">
          新增
        </Button>
        <Typography.Title level={2} style={{ textAlign: 'center' }}>
          <Table columns={columns} dataSource={dataSource}></Table>
        </Typography.Title>
      </Card>
    </PageContainer>
  );
};

export default Admin;
